<template>
  <!-- 前端展示 成果奖成果展示 -->
  <div class="containerA" :style="backgroundStyle">
    <div class="header">
      <div class="w">
        <div class="header-logo">
          <div class="sitelogocon">
            <img border="0" :src="define.comUrl + pageData.schoolemblemimageobj.url" />
          </div>

          <div class="titlecg">
            {{title}}
          </div>
          <div class="titlefh">
            <a href="/index" style="text-decoration: none;color:#fff">返回首页</a>
          </div>
        </div>

        <div class="titlecg2">
          <!--仅手机端显示-->
          {{title}}
        </div>
      </div>
    </div>

    <div class="box" id="box">
      <ul>
        <li v-for="(item,index) in dataList" :key="index" class="cards" @click.stop="goItem(item)">
          <article class="card card--1">
            <div class="card__info-hover">
              <div class="card__clock-info">
                <span class="card__time">序号：{{index+1}}</span>
              </div>
            </div>
            <div class="card__img"></div>
            <!-- <a href="javascript:;" class="card_link" target="_blank">
              <div class="card__img--hover"></div>
            </a> -->
            <div class="card__info">
              <span class="card__category">成果名称：</span>
              <h3 class="card__title">{{item.projectname}}</h3>
              <span class="card__by">成果完成人：<a href="javascript:;" class="card__author"
                  title="author" target="_blank">{{item.projectcompletionperson_name}}</a></span>
            </div>
          </article>
        </li>
      </ul>
    </div>
    <div class="footer">
      <div class="copyright">{{ pageData.imprint }}</div>
    </div>
  </div>
</template>

<script>

import request from "@/utils/request";
export default {
  components: {},
  props: {},
  data() {
    return {
      pageData: null,
      dataList: [],
      title: '',
      pageId: ''
    };
  },
  computed: {
    backgroundStyle() {
      return {
        background: `url(${this.define.comUrl}${this.pageData.backgroundsecondaryobj.url
          })`
      };
    }
  },
  created() {
    this.pageData = this.jnpf.storageGet("web_home_data");
    console.log(this.pageData);
    this.title = this.$route.query.title
    this.pageId = this.$route.query.id
    this.getList();
  },
  mounted() { },
  methods: {
    getList() {
      request({
        url: "/api/example/MzCompilationproject/getList",
        method: "post",
        data: {
          gaintype: this.pageId,
          isspread:'1'
        }
      }).then(res => {
        this.dataList = res.data.list
      });
    },
    goItem(item) {
      sessionStorage.setItem('projectFormItem', JSON.stringify(item))
      this.$router.push({ path: "/project" });
    }
  }
};
</script>
<style src="../../assets/css/styles.css"  scoped>
</style>
<style src="../../assets/css/styleList.css"  scoped>
</style>
<style scoped>
.card {
  background: url(~@/assets/images/web/cg.jpg);
}
.card__img {
  background: url(~@/assets/images/web/cg.jpg);
}
</style>

